<!--  -->
<template>
<div>
    <mt-header fixed title="商品分类">
      <router-link  to  slot="left">
        <mt-button icon="back" @click="$router.back(-1)" style="color:rgb(27,174,174)"></mt-button>
      </router-link> 
      </mt-header>
      <div class="border">
        <van-sidebar v-model="activeKey">
  <van-sidebar-item title="手机数码" id="0" />
  <van-sidebar-item title="男装女装" />
  <van-sidebar-item title="家具家纺" />
  <van-sidebar-item title="运动户外" />
  <van-sidebar-item title="游戏动漫" />
  <van-sidebar-item title="美妆清洁" />
  <van-sidebar-item title="工具装修" />
  <van-sidebar-item title="鞋靴箱包" />
  <van-sidebar-item title="玩具孕产" />
</van-sidebar>
<mt-tab-container v-model="activeKey">
  <mt-tab-container-item id="1">
    <div>打我们打孔</div>
  </mt-tab-container-item>
</mt-tab-container>

      </div>
     
      <Tabbar :selected="selected"></Tabbar>

</div>
</template>

<script>
    import Tabbar from "../components/TabbarName.vue";

export default {
data() {
return {
  selected:"ShopList",
  activeKey: 0,
}
},
//生命周期 - 创建完成（访问当前this实例）
created() {

},
//生命周期 - 挂载完成（访问DOM元素）
mounted() {

},
components: {
    Tabbar
  }
}
</script>
<style scoped>
/* @import url(); 引入css类 */
.mint-header{
        color: black;
        background-color: white;
        font-size: 10px;
    }
.van-sidebar{
  margin-top: 40px;
}

.border{
  display: flex;
}
</style>